﻿@{
    ViewBag.Title = "Process List";
}
<style>
    td.details-control {
        background: url('/Assets/res/details_open.png') no-repeat center center;
        cursor: pointer;
    }

    tr.shown td.details-control {
        background: url('/Assets/res/details_close.png') no-repeat center center;
    }
</style>
<div class="row">
    <div class="col-xs-12">
        <div hidden="hidden" id="editArea">
            <div class="visible-md visible-lg hidden-sm hidden-xs action-buttons">

                <a class="blue act-edit tooltip-info" data-rel="tooltip" data-placement="bottom" data-original-title="编辑" href="javascript:void(0)">
                    <i class="icon-pencil bigger-130"></i>
                </a>

                <a class="blue act-cog tooltip-info" data-rel="tooltip" data-placement="bottom" data-original-title="安装" href=" javascript:void(0)">
                    <i class="icon-cog bigger-130"></i>
                </a>

                <a class="blue act-test tooltip-info" data-rel="tooltip" data-placement="bottom" data-original-title="测试" href=" javascript:void(0)">
                    <i class="icon-cogs bigger-130"></i>
                </a>

                <a class="red act-delete tooltip-error" data-rel="tooltip" data-placement="bottom" data-original-title="删除" href="javascript:void(0)">
                    <i class="icon-trash bigger-130"></i>
                </a>
            </div>
            <div class="visible-xs visible-sm hidden-md hidden-lg">
                <div class="inline position-relative">
                    <button class="btn btn-minier btn-yellow dropdown-toggle" data-toggle="dropdown">
                        <i class="icon-caret-down icon-only bigger-120"></i>
                    </button>

                    <ul class="dropdown-menu dropdown-only-icon dropdown-yellow pull-right dropdown-caret dropdown-close">
                        <li>
                            <a href="javascript:void(0)" class="tooltip-info" data-rel="tooltip" title="" data-original-title="编辑">
                                <span class="blue act-eidt">
                                    <i class="icon-pencil bigger-120"></i>
                                </span>
                            </a>
                        </li>

                        <li>
                            <a href="javascript:void(0)" class="tooltip-info" data-rel="tooltip" title="" data-original-title="安装">
                                <span class="blue act-cog">
                                    <i class="icon-cog bigger-120"></i>
                                </span>
                            </a>
                        </li>

                        <li>
                            <a href="javascript:void(0)" class="tooltip-info" data-rel="tooltip" title="" data-original-title="测试">
                                <span class="blue act-test">
                                    <i class="icon-cogs bigger-120"></i>
                                </span>
                            </a>
                        </li>

                        <li>
                            <a href="javascript:void(0)" class="tooltip-error" data-rel="tooltip" title="" data-original-title="删除">
                                <span class="red act-delete">
                                    <i class="icon-trash bigger-120"></i>
                                </span>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="table-header">
            当前用户定义的流程模板列表如下：
            <button class="btn btn-success" onclick="showNewProcess()">
                <i class="icon-plus bigger-120"></i>
                新建
            </button>
            <button class="btn btn-success" onclick="table.ajax.reload().draw(false)">
                <i class="icon-refresh bigger-120"></i>
                刷新
            </button>
        </div>
        <table id="dtFiles" class="table table-striped table-bordered table-hover" cellspacing="0" width="100%">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>名称</th>
                    <th>创建日期</th>
                    <th>过期日期</th>
                    <th>备注</th>
                    <th>操作</th>
                </tr>
            </thead>
        </table>
    </div>
</div>
<script src="~/Assets/js/jquery.dataTables.min.js"></script>
<script src="~/Assets/js/jquery.dataTables.bootstrap.js"></script>
<script src="~/Assets/js/flexflow-tools.js"></script>
<script>

    var table;
    $(document).ready(function () {
        table = $('#dtFiles').DataTable({
            "ajax": {
                'url': "/UserDataApi/GetFiles?path=ProcessDefines",
                'type': 'POST'
            },
            "columns": [
                {
                    "data": "id",
                    "visible": false,
                },
                { "data": "fileName" },
                { "data": "uploadTime" },
                { "data": "outdateTime" },
                {
                    "data": "tag",
                    "render":
                        function (data, type, full, meta) {
                            return buildTag(data);
                        }
                },
                {
                    "orderable": false,
                    "data": null,
                    "defaultContent": $('#editArea').html()
                }
            ],
            "language": {
                "url": "/assets/res/DT_Language_zh_CN.txt"
            }
        });
        table.on("draw.dt", function () {
            $('[data-rel=tooltip]').tooltip();
        })
        // Add event listener for opening and closing details
        $('#dtFiles tbody').on('click', '.act-download', function () {
            var tr = $(this).closest('tr');
            var row = table.row(tr);
            window.location = ("/UserDataAPI/DownloadFile?fileId=" + row.data().id);
        });
        $('#dtFiles tbody').on('click', '.act-delete', function () {
            var tr = $(this).closest('tr');
            var row = table.row(tr);
            bootbox.confirm("确定要删除流程定义文件 " + row.data().fileName + " 吗？此操作不可恢复！", function (r) {
                if (r == true) {
                    doOperation({
                        'url': '/UserDataAPI/DeleteFile',
                        'data': {
                            'fileDesId': row.data().id
                        },
                        'success': function (d) {
                            bootbox.alert("删除成功！");
                            row.remove().draw(false)
                        }
                    });
                }
            })
        });
        $('#dtFiles tbody').on('click', '.act-cog', function () {
            var tr = $(this).closest('tr');
            var row = table.row(tr);
            bootbox.prompt("请输入流程定义源 " + row.data().fileName + " 安装后的流程名称，按“确定”开始安装，按“取消”取消安装。", function (result) {
                if (result === null) {
                    bootbox.alert("已取消安装！");
                } else {
                    doOperation({
                        'url': '/ProcessDefineAPI/Install',
                        'data': {
                            'fileId': row.data().id,
                            'name': result
                        },
                        'success': function (d) {
                            bootbox.alert("已成功加入安装队列！");
                            table.ajax.reload().draw(false);
                        }
                    });
                }
            });
        });
        $('#dtFiles tbody').on('click', '.act-edit', function () {
            var tr = $(this).closest('tr');
            var row = table.row(tr);
            openNewWindow("/ProcessDefine/Edit?id=" + row.data().id,
                '编辑流程定义-' + row.data().id);
            //navgateUrl("/ProcessDefine/Edit?id=" + row.data().id)
        });
        $('#dtFiles tbody').on('click', '.act-test', function () {
            var tr = $(this).closest('tr');
            var row = table.row(tr);
            doOperation({
                'url': '/ProcessDefineAPI/GetInstalledProcIdByFileId',
                'data': {
                    'fileId': row.data().id
                },
                'success': function (d) {
                    startProcess(d.Tag);
                }
            });
        });
    });

    function showNewProcess() {
        bootbox.prompt("请输入要创建的流程定义文件名称：", function (result) {
            if (result == null) {
                bootbox.alert("操作已被取消");
            } else {
                doOperation({
                    'url': '/ProcessDefineAPI/Create',
                    'data': {
                        'name': result
                    },
                    'success': function (d) {
                        bootbox.alert("创建流程定义成功！");
                        table.ajax.reload().draw(false);
                    }
                });
                //navgateUrl("/ProcessDefine/Edit?action=new&name=" + result);
            }
        });

    }

</script>